import { Form, Input, Button, message, Space } from "antd";
import { useReactive } from "ahooks";
import { useModel } from "umi";
import { v4 as uuidv4 } from "uuid";

const EditBrandModle = (props) => {
	const { onCloseGlobalModal } = useModel("global.modal", (model) => model);
	const [form] = Form.useForm();

	const state = useReactive({
		submitLoading: false,
	});

	const onFinish = async (values) => {
		state.submitLoading = true;
		console.log(props);

		state.submitLoading = false;
	};

	return (
		<div>
			<Form form={form} layout="horizontal" onFinish={onFinish} labelCol={{ span: 4 }} wrapperCol={{ span: 19 }}>
				<Form.Item label="合作品牌" name="ccName" validateTrigger="onBlur" rules={[{ required: true }]} style={{ marginTop: 20 }}>
					<Input placeholder="请输入合作品牌名称" />
				</Form.Item>

				<Form.Item label="品牌公司" name="ccName" validateTrigger="onBlur" style={{ marginTop: 20 }}>
					<Input placeholder="请输入品牌公司" />
				</Form.Item>

				<div style={{ marginTop: 20, textAlign: "center" }}>
					<Space>
						<Button loading={state.submitLoading} type="primary" htmlType="submit" style={{ width: "100%" }}>
							提交
						</Button>
						<Button loading={state.submitLoading} onClick={onCloseGlobalModal}>
							取消
						</Button>
					</Space>
				</div>
			</Form>
		</div>
	);
};

export default EditBrandModle;
